<template>
  <div class="con-404">
    <img src="/images/404-logo.png" alt="">

    <div>您访问的页面迷失在外太空，将于 <span>{{seconds}}</span> 秒后返回首页。</div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      seconds : 10,
      timer : 0
    }
  },

  components: {},

  computed: {},

  methods: {},

  mounted(){
    this.timer = setInterval(()=>{
      if(this.seconds-- <= 1){
        clearInterval(this.timer);
        window.location.href = "/";
      }
    },1000)
  },
  beforeDestroy () {
    if(this.timer){
      clearInterval(this.timer);
    }
  }
}

</script>
<style rel="stylesheet/less" lang="less" scoped>
.con-404{
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: #340030;
  text-align: center;
  color: #fff;

  img{
    margin: 30px auto;
  }

  span{
    color: yellow
  }
}
</style>
